<template>
  <div>
    <Table :columns="columns" :data="serviceData"></Table>
    <Modal v-model="feedModal" width="550">
      <p slot="header">
        <span>查看反馈</span>
      </p>
      <div style="text-align:left;font-size: 14px;">
        <p><strong>姓名：</strong><span>{{modalData.name}}</span></p>
        <Divider />
        <p><strong>联系方式：</strong><span>{{modalData.contact}}</span></p>
        <Divider />
        <p><strong>地址：</strong><span>{{modalData.address}}</span></p>
        <Divider />
        <p><strong>意向：</strong><span>{{modalData.yixiang}}</span></p>
        <Divider />
        <p><strong>问题反馈：</strong><span>{{modalData.problem}}</span></p>
        <Divider />
        <p><strong>提交时间：</strong><span>{{modalData.datetime}}</span></p>
      </div>
      <div slot="footer">
        <Button type="success" @click="feedModal=false">确定</Button>
      </div>
    </Modal>
  </div>
</template>

<script>
export default {
  layout: "admin",
  data() {
    return {
      columns: [
        {
          title: "#",
          type: "index"
        },
        {
          title: "姓名",
          key: "name"
        },
        {
          title: "联系方式",
          key: "contact"
        },
        {
          title: "地址",
          key: "address"
        },
        {
          title: "意向",
          key: "yixiang"
        },
        {
          title: "操作",
          render: (h, param) => {
            return h("Button", {
              props: {
                type: "primary"
              },
              on: {
                click: () => {
                  this.modalData = param.row
                  this.feedModal = true
                }
              }
            }, '查看详情');
          }
        }
      ],
      serviceData: [],
      modalData: {
        name: '',
        address: '',
        contact: '',
        yixiang: '',
        problem: '',
        datetime: '',
        ip: ''
      },
      feedModal: false
    };
  },
  methods: {
    getList(url, _this) {
      _this.$axios.get(url).then(res => {
        if (res.data.code == 200) {
          _this.serviceData = res.data.detail.list
        } else {
          _this.$Message.error('获取列表失败，请稍后重试！')
        }
      }).catch(err => {
        _this.$Message.error('网络错误，请稍后重试！')
      })
    }
  },
  mounted() {
    const url = '/adminapi/getServiceList?pageno=1&pagesize=10'
    this.$options.methods.getList(url, this)
  }
};
</script>
